<template>
  <div class="header" >
    <div class="news-header">
      <el-button
          text
          class="left"
      >
        政策文件
      </el-button>
      <el-button
          :type = 'type1'
          text
          link
          @click="enter"
      >
        查看更多
      </el-button>
    </div>
    <div class="news-body" v-if="data.length > 0" >
      <el-row v-for="item in data" :key="item.noticeId" >
        <el-col  :span="24"  class='news-body-bot' >
          <div class="blue-btn"></div>
          <div class="grid-content ep-bg-purple-dark news-menu ">{{ item.noticeTitle}}</div>
        </el-col>
      </el-row>
    </div>
    <el-empty v-else description="暂无数据" />

  </div>
</template>
<script setup >
import { homeListnot } from "../../api/index";
import { useRouter } from "vue-router";
const router = useRouter()
const type1 = 'primary'
import { ref,onMounted } from 'vue';
const data = ref([]);
onMounted(()=>{
  // home()
})
const home  = async () => { // 函解构用async和await包裹
  let params = {
    pageNum: 1,  //
    pageSize: 10,
    noticeType:'3'  // （1通知公告 2新闻动态 3正常文件）
  }
  const {rows,code} = await homeListnot(params)
  // 对data进行解构赋值 取出请求的结果res
  if(code==200){
    data.value = rows
  }else{
    console.log(code)
  }// 控制台打印结果 => 请求成功 code为200
}
function enter(){
  router.push({path:'/information/policy'})
}
</script>
<style>
.header{
  width: 100%;
  padding: 20px;
  margin-left:20px ;
  overflow: visible;
  margin-top: 20px;
}
.news-header{
  display: flex;
  justify-content: space-between;
}
.el-row {
  margin-bottom: 20px;
  height: 20px;
}

.el-row:last-child {
  margin-bottom: 0;
  height: 20px;
}

.el-col {
  border-radius: 4px;
}

.grid-content {
  border-radius: 4px;
  min-height: 20px;
}
.news-menu{
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}
.news-body{
  overflow: hidden;
}
.left{
  float: left;
  font-size: 16px;
  font-weight: bold;
}
.right{
  float: right;
}
.blue-btn{
  width: 10px;
  height: 10px;
  border-radius: 10px;
  background-color: blue;
  float: left;
  margin-top: 6px;
  margin-right: 10px;
}
.news-body-bot{
  height: 30px;
}

</style>
